My personal website.
entomoviscera.online
1---
2import { getCollection, render } from "astro:content";
3import Base from "/components/Base.astro";
4import Toolbar from "/components/Toolbar.astro";
5import "/styles/main.css";
6
7export async function getStaticPaths() {
8 const posts = await getCollection("blog");
9 return posts.map((post) => ({
10 params: { slug: post.id },
11 props: { post },
12 }));
13}
14
15const { post } = Astro.props;
16const { Content } = await render(post);
17---
18
19<Base
20 title={`LOG_${post.data.pub.getFullYear()}-${post.data.pub.getMonth() + 1}-${post.data.pub.getDate()} | ${post.data.title}`}
21 graph={{
22 description: post.data.bio,
23 type: "article",
24 }}
25>
26 <Toolbar backlink="/blog" />
27 <article class="bwcontainer">
28 <header class="bwbox center">
29 <h1>{post.data.title}</h1>
30 <time
31 class="barcodetext"
32 datetime={`${post.data.pub.getFullYear()}-${post.data.pub.getMonth() + 1}-${post.data.pub.getDate()}`}
33 >
34 {
35 `${post.data.pub.getFullYear()}-${post.data.pub.getMonth() + 1}-${post.data.pub.getDate()}`
36 }
37 </time>
38 </header>
39 <div class="bwbox">
40 <Content />
41 </div>
42 </article>
43</Base>
44
45<style>
46 h1 {
47 margin-bottom: 13px;
48 }
49
50 time {
51 font-weight: bold;
52 font-size: 2.5rem;
53 }
54
55 article {
56 max-width: 82ch;
57 margin: 0 auto;
58 }
59</style>